<template>
	<view>
		<z-paging style="height: 100% !important;" class="wrap" ref="paging" v-model="SpareList" @query="queryList">
			<cu-custom style="height: 0px;" bgColor="bg-gradual-blue" :isBack="true">
				<block slot="backText">返回</block>
				<block slot="content">领用单审批</block>
			</cu-custom>
			<view class="content" style="padding-top: 0rpx;">
				
				<!-- 头部结束 -->
				<view slot="top" class="search">
					<u-search placeholder="请输入审批单号搜索" v-model="requestData.KeyWord" @custom='search()' @search='search()'></u-search>
				</view>
				<view style="margin-top: 20rpx;padding-top: 0px;" class="content-body">
					<view class="shop-car">
						<view class="store-box" v-for="(itemq,indexq) in SpareList" :key="indexq">
							<view class="ETBJAndFSEntitytitle">
								<text class="ETBJAndFSEntitytitle-left">领用单号：{{itemq.OutCode}}</text>
								<text class="ETBJAndFSEntitytitle-right" :class="itemq.Status==1?'status1':itemq.Status==2?'status2':'status3'">
								{{itemq.Status==1?'审核中':itemq.Status==2?'已通过':'已驳回'}}
								</text>
							</view>
							<view class="goodsInfo" v-for="(itemw,indexw) in itemq.ETBJAndFSEntityDTO" :key="indexw">
								<view class="goodsInfo-right">
									<image :src="spareNoData" class="goods-image" mode=""></image>
									<view class="goodsInfo-box">
										<text class="goods-name">{{itemw.Name}}</text>
										<text class="spe">规格/型号：{{itemw.Model}} / {{itemw.Unit}}</text>
										<text class="spe">库存：{{ itemw.Number }}</text>
										<view class="goods-box">
											<text class="goods-price">申请：{{itemw.ApplyCounts}}</text>
											<text class="goods-price1">审批：{{itemw.AcceptCounts}}</text>
											<view class="goods-num-box" v-if="itemq.Status==1" >
												<view class="goods-image" @tap="sub(indexq,indexw,itemw.AcceptCounts)">
													<text>-</text>
												</view>
												<view class="goods-num">
													<text>{{itemw.AcceptCounts}}</text>
												</view>
												<view class="goods-image" @tap="add(indexq,indexw,itemw.AcceptCounts)">
													<text>+</text>
												</view>
											</view>
										</view>
									</view>
								</view>
							</view>
							<view class="ETBJAndFSEntitytitle">
								<text class="ETBJAndFSEntitytitle-right status1"  style="font-weight: 700;color:#919298;text-align: left;float:left">
									<text style="margin-right: 20rpx;"><text style="margin-right: 10rpx;" class="bxImg cuIcon-my text-grey"></text>{{itemq.OutQrcodeUserName}}</text>
									<text ><text style="margin-right: 10rpx;" class="bxImg cuIcon-time text-grey"></text>{{itemq.AddTime}}</text>
								</text>
							</view>
							<view  v-if="itemq.Status==1" class="ETBJAndFSEntitytitle">
								<view class="bottom">
									<view class="btnBox">
										<view @click="accept(itemq.Id,3,itemq)" class="evaluate btn">驳回</view>
									</view>
									<view class="btnBox">
										<view @click="accept(itemq.Id,2,itemq)" class="evaluate1 btn">通过</view>
									</view>
								</view>
								<!-- <text class="ETBJAndFSEntitytitle-right status1"  style="font-weight: 400;">
									查看详情 > 
								</text> -->
							</view>
						</view>
					</view>
				</view>
			</view>
	</z-paging>
	</view>
</template>

<script>
import ActiveForm from "@/components/active-form/active-form";
import request from '@/common/request.js';
import QQMapWX from "@/common/qqmap-wx-jssdk";
export default {
   components: {
      ActiveForm 
   },
    data() {
        return {
			spareNoData:this.$request22.baseUrl1+'/Resource/Sg/spare/sparenodata.png',
			goodsNav: 1,
			status:0,
			modalName: null,
			id:0,
			orderList: [],
			SpareList:[],
			requestData:{
				KeyWord:'',
				status:0,
				PageIndex:1,
				PageSize:10,
			},
		};
    },
	onShow: function() {
		let that = this
		that.queryList(1,10);
	},
	onLoad(option) {
		this.id=option.id
		this.requestData.status=option.status
	},
    methods: {
		accept(id,status,itemq){
			console.log('accept')
			console.log(id)
			console.log(status)
			console.log(itemq)
			let isExceed=false
			let that=this
			if(itemq.ETBJAndFSEntityDTO!=null&&itemq.ETBJAndFSEntityDTO.length>0){
				for(let i=0;i<itemq.ETBJAndFSEntityDTO.length;i++){
					if(itemq.ETBJAndFSEntityDTO[i].AcceptCounts>itemq.ETBJAndFSEntityDTO[i].Number){
						console.log(itemq.ETBJAndFSEntityDTO[i].AcceptCounts,itemq.ETBJAndFSEntityDTO[i].Number)
						isExceed=true
						break
					}
				}
			}
			if(isExceed&&status==2){
				uni.showModal({
					title: '库存警告',
					content: '出库量大于库存量是否继续?',
					success: function (res111) {
						if (res111.confirm) {
							let opts = {
								url: 'spareapi/UpdateOutboundSpareStatus',
								method: 'POST'
							};
							let params={
								outId:id,
								status:status,
								itemq:itemq
							}
							let title='确认通过吗?'
							console.log(JSON.stringify(itemq))
							uni.showModal({
								title: '提示',
								content: title,
								success: function (res) {
									if (res.confirm) {
										request.httpTokenRequest(opts,params).then(res => {
											if(res.data.code == 1){
												uni.showToast({ title: '审核成功' ,icon: 'none' ,duration:3000});
												that.queryList(1,10);
											}
											else{
												uni.showToast({ title: res.data.msg, icon: 'none',duration:6000 });
											}
										});
									}
								}
							});
						}
					}
				});
			}else{
				let opts = {
					url: 'spareapi/UpdateOutboundSpareStatus',
					method: 'POST'
				};
				let params={
					outId:id,
					status:status,
					itemq:itemq
				}
				let title='确认通过吗?'
				if(status==3){
					title='确认驳回吗?'
				}
				console.log(JSON.stringify(itemq))
				uni.showModal({
					title: '提示',
					content: title,
					success: function (res) {
						if (res.confirm) {
							request.httpTokenRequest(opts,params).then(res => {
								if(res.data.code == 1){
									uni.showToast({ title: '审核成功' ,icon: 'none' });
									that.queryList(1,10);
								}
								else{
									uni.showToast({ title: res.data.msg, icon: 'none' });
								}
							});
						}
					}
				});
			}
		
		},
		queryList(pageNo, pageSize){
			let that=this
			let opts = {
				url: 'spareapi/GetChooseOutboundSpareList',
				method: 'get'
			};
			that.requestData.PageIndex=pageNo;
			that.requestData.PageSize=pageSize;
			request.httpTokenRequest(opts,that.requestData).then(res => {
				if(res.data.code == 1){
					this.$refs.paging.complete(res.data.data);
					//that.SpareList=res.data.data
				}
				else{
					uni.showToast({ title: res.data.msg, icon: 'none' });
				}
			});
		},
		// 搜索框
		search(e){
			let that=this
			that.SpareList=[]
			that.requestData.PageIndex=1;
			that.requestData.PageSize=10;
			that.requestData.KeyWord=e
			this.queryList(1,10);
		},
		choisespare(){
			uni.navigateTo({
				url:'/pages-device/spare/choosespare?sceneId='+this.id
			})
		},
		setNav(goodsNav) {
			let that=this
			that.goodsNav = goodsNav
		},
		getTime: function() {
			let that=this
			 let imageIndex= that.formData.findIndex(e => e.id === 'asdfdfgd')
			var date = new Date(),
				year = date.getFullYear(),
				month = date.getMonth() + 1,
				day = date.getDate(),
				hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
				minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(),
				second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
			month >= 1 && month <= 9 ? (month = "0" + month) : "";
			day >= 0 && day <= 9 ? (day = "0" + day) : "";
			var timer = year + '年' + month + '月' + day + '日';
			var timer2 = hour + ':' + minute + ':' + second;
			that.formData[imageIndex].watermark.nowTime=timer+' '+timer2
		},
		// 提交表单
		sub() {
			this.$vervify(this.formData); //表单校验 成功会继续往下走 失败抛出异常

			const res = this.$submitForm(this.formData); //校验成功 获取表单值
			let that=this
			let opts = {
				url: 'api/HandleQrcodeScene',
				method: 'post'
			};
			console.log(res)
			that.requestData.Desc=res.Desc;
			that.requestData.Desc=res.Desc;
			that.requestData.Id=that.id;
			that.requestData.isok=res.isok=='已解决'?1:0;
			let images=[]
			if(that.formData[2].rules[0].value!=null&&that.formData[2].rules[0].value!=''){
				images.push('/Resource'+that.formData[2].rules[0].value.split('Resource')[1])
			}
			if(that.formData[2].rules[1].value!=null&&that.formData[2].rules[1].value!=''){
				images.push('/Resource'+that.formData[2].rules[1].value.split('Resource')[1])
			}
			if(that.formData[2].rules[2].value!=null&&that.formData[2].rules[2].value!=''){
				images.push('/Resource'+that.formData[2].rules[2].value.split('Resource')[1])
			}
			that.requestData.Images=images;
			that.requestData.Video=that.formData[3].rules.value;
			
			uni.getLocation({
				type: 'gcj02',
				altitude: true,
				success(res) {
					that.requestData.Longitude=res.longitude;
					that.requestData.Latitude=res.latitude;
					
					request.httpTokenRequest(opts,that.requestData).then(res => {
						uni.showLoading({
							title: '加载中'
						})
						if(res.data.code == 1){
							uni.showToast({ title:'处理成功', icon: '/static/success.png' });
							
							setTimeout(() => {
								 uni.reLaunch({
									url: '/pages/index/tabbar?PageCur='+'index'
								 });
							}, 1000)
							
							uni.hideLoading();
							
						}
						else{
							uni.showToast({ title: res.data.msg, icon: 'none' });
						}
					})
				},fail() {
					request.httpTokenRequest(opts,that.requestData).then(res => {
						uni.showLoading({
							title: '加载中'
						})
						if(res.data.code == 1){
							uni.showToast({ title:'处理成功', icon: '/static/success.png' });
							
							setTimeout(() => {
								 uni.reLaunch({
									url: '/pages/index/tabbar?PageCur='+'index'
								 });
							}, 1000)
							
							uni.hideLoading();
							
						}
						else{
							uni.showToast({ title: res.data.msg, icon: 'none' });
						}
					})
				}
			})
			
			
		},
		//选择备件-old
		chooseBeiJian(){
			uni.navigateTo({
				url:'/pages-device/spare/choosespare?sceneId='+this.id
			})
		},
		//减少 chooseSpareList.ETBJAndFSEntityDTO
		sub(storeIndex, goodsIndex, goodsnum){
			if(goodsnum == 1){
				uni.showToast({ title: '数量最低为1个', icon: 'none' });
				return
			}else{
				this.SpareList[storeIndex].ETBJAndFSEntityDTO[goodsIndex].AcceptCounts--
				console.log(this.SpareList[storeIndex].ETBJAndFSEntityDTO[goodsIndex].AcceptCounts)
			}
			this.statistics()
		},
		//增加
		add(storeIndex, goodsIndex, goodsnum){
			console.log('add')
			this.SpareList[storeIndex].ETBJAndFSEntityDTO[goodsIndex].AcceptCounts++
			console.log(this.SpareList[storeIndex].ETBJAndFSEntityDTO[goodsIndex].AcceptCounts)
			this.statistics()
		},
		//统计
		statistics(){
		},
  },
};
</script>



<style lang="scss" scoped>	
//<style lang="less">
.search{
	width: 100%;
	height: 100rpx;
	padding: 20rpx 2% 0 2%;
	background-color: #fff;
	// display: flex;
	// align-items: center;
}
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 30rpx;
}


.each{
	width: 100%;
}
.repairType{
	border-radius:16rpx 16rpx 0 0;
	box-sizing: border-box;
	width: 94%;
	margin: 0 3%;
	background-color: #fff;
	height: 80rpx;
	line-height: 80rpx;
	padding: 0 25rpx;
	font-weight: 700;
	font-size: 30rpx;
	border-bottom:1px solid rgba(242, 242, 242, 1)
}
.repairBox{
	border-radius: 0 0 16rpx 16rpx;
	box-sizing: border-box;
	width: 94%;
	margin: 0 3% 0rpx 3%;
	padding: 25rpx ;
	background-color: #fff;
	display: flex;
	justify-content: space-around;//实现水平方向均匀布局，space-between水平靠左靠右
	text-align: center;
	.selectType{
		width: 26%;
		height: 60rpx;
		line-height: 60rpx;
		color: #409eff;
		background-color: #f6faff;
		border:1px solid rgba(160, 207, 255, 1);
		border-radius: 5px;
	}
	.eachType{
		width: 26%;
		height: 60rpx;
		line-height: 60rpx;
		color: #999999;
		background-color: #fff;
		border:1px solid rgb(233, 233, 233);
		border-radius: 5px;
		font-size: 26rpx;
	}
}



	.goods-empty-wrap {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 40%;
	}
	.goods-item-wrap {
		margin-top: 24rpx;
	}
	
	.goods-header-wrap {
		display: flex;
		align-items: center;
		padding: 24rpx;
		background: #FFFFFF;
		margin-bottom: 10rpx;
	}
	.goods-header-item-active{
		font-size: 36rpx;
		font-color: #333333;
		font-weight: bold;
		position: relative;
	}
	.goods-header-item-active::after{
		position: absolute;
		left: 0;
		right: 0;
		background: #4372fe;
		height: 8rpx;
		content: "";
		bottom: -12rpx;
	}
	.goods-header-item-action {
		position: relative;
	}
	.extraPosition{
		position: absolute;
		right: -5rpx;
		top: -10rpx;
		font-size: 20rpx;
		padding: 0rpx 10rpx;
		height: 28rpx;
		color: #ffffff;
		background-color: #dd514c;
		display: inline-flex;
		align-items: center;
		justify-content: center;
	}
	.goods-header-item {
		margin-right: 42rpx;
	}

	.content-body{
		padding-top: 20rpx;
		padding-bottom: 200rpx;
		width: 100%;
		background-color: white;
	}
	.choisespare{
		margin:auto;
		background: #F3F4F6;
		color: #333333;
		height: 72rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 12rpx;
		width: 420rpx;
		margin-top: 60rpx;
		margin-bottom: 60rpx;
		font-weight: 600;
	}
	.goods-empty-wrap {
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 40%;
	}
	
	
	.goods-item-wrap {
		background: #FFFFFF;
		display: flex;
		padding: 24rpx;
		margin: 12rpx;
		border-radius: 8rpx;
	}
	.goods-image {
		width: 200rpx;
		height: 200rpx;
		border-radius: 4rpx;
		flex: none;
	}
	.goods-content-wrap {
		padding-left: 24rpx;
	}	
	.goods-name {
		font-size: 32rpx;
		font-weight: bold;
		display: flex;
		position: relative;
	}
	
	.goods-stock-wrap {
		display: flex;
		color: #969696;
		font-size: 24rpx;
		margin-top: 12rpx;
	}
	
	.goods-stock {
		margin-right: 24rpx;
	}
	
	
	.empty-shop-car {
		width: 750rpx;
		min-height: 680rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
	
		.empty-shop-car-image {
			width: 340rpx;
			height: 278rpx;
			margin-top: 102rpx;
		}
	
		text {
			margin-top: 40rpx;
			font-size: 28rpx;
			font-weight: 400;
			color: #666666;
		}
	
		.empty-shop-car-btn {
			width: 240rpx;
			height: 90rpx;
			background: #0081ff;
			color: #FFFFFF;
			border-radius: 200rpx;
			margin-top: 40rpx;
			text-align: center;
			line-height: 90rpx;
			font-size: 30rpx;
			font-weight: 400;
		}
	}
	
	.shop-car {
		width: 750rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		background-color: #F3F4F6;
	
		.shop-car-header {
			width: 690rpx;
			height: 80rpx;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: flex-end;
	
			text {
				font-size: 28rpx;
				font-weight: 400;
				color: #313133;
			}
		}
	
		.store-box {
			width: 750rpx;
			margin-bottom: 20rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			background-color: #FFFFFF;
	
			.store-header {
				width: 690rpx;
				height: 78rpx;
				padding: 0 30rpx;
				display: flex;
				flex-direction: row;
				align-items: center;
				font-size: 28rpx;
				font-weight: 400;
				color: #313133;
	
				.checked-image {
					width: 36rpx;
					height: 36rpx;
				}
	
				text {
					font-size: 28rpx;
					font-weight: 400;
					color: #313133;
					margin-left: 20rpx;
				}
	
				.label {
					width: 14rpx;
					height: 24rpx;
					margin-left: 10rpx;
					margin-top: 5rpx;
				}
			}
	
			.goodsInfo {
				width: 690rpx;
				height: 266rpx;
				display: flex;
				flex-direction: row;
				align-items: center;
				border-bottom: 2rpx solid #EDEDED;
	
				&:nth-last-child(1) {
					border: none;
				}
	
				.checked-image {
					width: 36rpx;
					height: 36rpx;
				}
	
				.goodsInfo-right {
					width: 634rpx;
					height: 246rpx;
					margin-left: 20rpx;
					display: flex;
					flex-direction: row;
					align-items: center;
	
					.goods-image {
						width: 180rpx;
						height: 180rpx;
					}
	
					.goodsInfo-box {
						width: 428rpx;
						margin-left: 24rpx;
						display: flex;
						flex-direction: column;
						align-items: center;
	
						.goods-name {
							width: 428rpx;
							font-size: 32rpx;
							font-weight: 600;
							color: #313133;
							
						}
	
						.spe {
							width: 428rpx;
							margin-top: 10rpx;
							font-size: 24rpx;
							font-weight: 400;
							color: #919298;
						}
	
						.goods-box {
							width: 428rpx;
							margin-top: 18rpx;
							display: flex;
							flex-direction: row;
							align-items: center;
							justify-content: space-between;
	
							.goods-price {
								font-size: 28rpx;
								font-weight: 600;
								color: #e7612e;
							}
							.goods-price1 {
								font-size: 28rpx;
								font-weight: 600;
								color: #54B886;
							}
							
							.goods-num-box {
								width: 168rpx;
								height: 46rpx;
								display: flex;
								flex-direction: row;
								align-items: center;
	
								.goods-image {
									width: 46rpx;
									height: 44rpx;
									text-align: center;
									line-height: 44rpx;
									border: 1rpx solid #CFCFCF;
									font-size: 38rpx;
								}
	
								.goods-num {
									width: 76rpx;
									height: 44rpx;
									text-align: center;
									line-height: 44rpx;
									font-size: 33rpx;
									font-weight: 400;
									color: #666666;
									border-top: 1px solid #CFCFCF;
									border-bottom: 1px solid #CFCFCF;
								}
							}
						}
					}
				}
			}
		}
	
		.statistics-box {
			width: 750rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			background-color: #FFFFFF;
			position: fixed;
			bottom: 0;
	
			.statistics {
				width: 720rpx;
				padding: 0 0 0 30rpx;
				height: 98rpx;
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: space-between;
	
				.statistics-left {
					width: 120rpx;
					display: flex;
					flex-direction: row;
					align-items: center;
					justify-content: space-between;
	
					image {
						width: 36rpx;
						height: 36rpx;
					}
	
					text {
						font-size: 30rpx;
						font-weight: 400;
						color: #313133;
					}
				}
	
				.statistics-right {
					width: 600rpx;
					display: flex;
					flex-direction: row;
					align-items: center;
					justify-content: flex-end;
	
					.btn {
						width: 218rpx;
						height: 98rpx;
						background: #0081ff;
						color: white;
						text-align: center;
						line-height: 98rpx;
						font-size: 30rpx;
						font-weight: 400;
						margin-left: 40rpx;
					}
	
					text {
						font-size: 30rpx;
						font-weight: 400;
						color: white;
					}
	
					.text-color {
						color: rgba(242, 18, 18, 1);
					}
				}
			}
	
			.gap {
				width: 750rpx;
				height: 40rpx;
			}
		}
	}
	.ETBJAndFSEntitytitle{
		width: 100%;
		height: 80rpx;
		//border-bottom: 1px solid #F2F5F9;
		padding-left: 40rpx;
		margin-bottom: 20rpx;
		line-height: 80rpx;
		.ETBJAndFSEntitytitle-left{
			width: 80%;
			height: 100%;
			text-align: left;
			color: #313133;
			font-size: 28rpx;
			font-weight: 600;
			display: block;
			float: left;
		}
		.ETBJAndFSEntitytitle-right{
			width: auto;
			height: 100%;
			text-align: right;
			color: #313133;
			font-size: 28rpx;
			font-weight: 600;
			display: block;
			float: right;
			margin-right: 40rpx;
		}
		// 1 审核中，2 通过，3 驳回
		.status1{
			color: #FC9979;
		}
		.status2{
			color: #54B886;
		}
		.status3{
			color: #e54d42;
		}
		
		.bottom {
			line-height: 70rpx;
			display: flex;
			align-items: center;
			.btnBox{
				width: 220rpx;
				display: flex;
				justify-content: space-between;
				float:right;
				margin-right: 20rpx;
				.btn {
					line-height: 62rpx;
					width: 220rpx;
					border-radius: 31rpx;
					border: 2rpx solid $u-tips-color;
					font-size: 26rpx;
					text-align: center;
					color: $u-tips-color;
				}
				.evaluate {
					color: $u-type-primary;
					border-color: $u-type-primary;
				}
				.evaluate1 {
					color:white;
					background-color: $u-type-primary;
					border-color: $u-type-primary;
					// color: $u-type-primary;
					// border-color: $u-type-primary;
				}
			}
		}
	}
	
</style>